<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>居民主页面</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=0">
		<meta content="yes" name="apple-mobile-web-app-capable">
		<link rel="stylesheet" href="../font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.min.css" />
		<link rel="stylesheet" href="../css/project.css" />
		<script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
		<style type="text/css">
			@font-face {
				font-family: 'iconfont';
				src: url('../iconfont/iconfont.eot');
				/* IE9*/
				src: url('../iconfont/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
				url('../iconfont/iconfont.woff') format('woff'), /* chrome、firefox */
				url('../iconfont/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
				url('../iconfont/iconfont.svg#iconfont') format('svg');
				/* iOS 4.1- */
			}
			
			.iconfont {
				font-family: "iconfont" !important;
				font-size: 16px;
				font-style: normal;
				-webkit-font-smoothing: antialiased;
				-webkit-text-stroke-width: 0.2px;
				-moz-osx-font-smoothing: grayscale;
			}
		</style>
	</head>

	<body>
		<div class="userTop">
			<span><select><option>环保小区18#602</option></select><i class="iconfont userTop_right">&#xe6ab;</i></span>
			<!--缩略菜单-->
			<div class="userThumbnail">
				<a href="#">
					<div><i class="iconfont">&#xe723;</i>扫一扫</div>
				</a>
				<a href="#">
					<div><i class="iconfont">&#xe74a;</i>切换身份</div>
				</a>
				<a href="#">
					<div><i class="iconfont">&#xe968;</i>监督举报</div>
				</a>
				<a href="#">
					<div><i class="iconfont">&#xe736;</i>家庭二维码</div>
				</a>
			</div>
		</div>
		<!--<div class="kong" /></div>-->
		<!--轮播图-->
		<div id="container">
			<div class="sections">
				<a href="#">
					<div class="section" id="section0"></div>
				</a>
				<a href="#">
					<div class="section" id="section1"></div>
				</a>
				<a href="#">
					<div class="section" id="section2"></div>
				</a>
				<a href="#">
					<div class="section" id="section3"></div>
				</a>
			</div>
		</div>

		<script src="../js/jquery-1.11.0.min.js" type="text/javascript"></script>
		<script src="../dist/pageSwitch.min.js"></script>
		<script>
			$("#container").PageSwitch({
				direction: 'horizontal',
				easing: 'ease-in',
				duration: 1000,
				autoPlay: true,
				loop: 'false'
			});
		</script>
		<!--轮播图结束-->
		<div class="kong"></div>
		<div class="usersel">
			<div class="userselect"><i class="fa fa-heart-o" aria-hidden="true"></i>
				<p>预约服务</p>
			</div>
			<div class="userselect"><i class="iconfont bank">&#xe75b;</i>
				<p>绿色银行</p>
			</div>
			<div class="userselect"><i class="iconfont bank">&#xe74c;</i>
				<p>绿丝带</p>
			</div>
		</div>
		<div class="kong"></div>
		<div id="user_news">
			<div class="userNew">最新消息</div>
			<div class="userButton">
				<button>积分</button>
				<button>系统</button>
			</div>
			<div class="userContent">
				<span>您的垃圾增加了20分</span>
				<span>您的垃圾.......</span>
			</div>
		</div>
		<div class="userParticipate">你今天参与分类了吗</div>
		<div class="usersel">
			<div class="userselect">
				<i class="iconfont bank">&#xeba2;</i>
				<p>点赞</p>
			</div>
			<a href="kichen_submit.html">
				<div class="userselect">
					<i class="iconfont bank">&#xe67e;</i>
					<p>标签投放</p>
				</div>
			</a>
			<a href="kichen_submit.html">
				<div class="userselect">
					<i class="iconfont bank">&#xe639;</i>
					<p>拍照投放</p>
				</div>
			</a>
		</div>
		<div class="kong konghight">
			<p class="banquan">
				<p>©2018 i分类.</p>
				<p> All rights reserved.</p>
			</p>
		</div>
		<footer>
			<div class="usersel1">
				<div class="userselect1">
					<i class="iconfont bank1">&#xe6a6;</i>
					<p class="userIclassfy">i分类</p>
				</div>
				<div class="userselect2">
					<i class="iconfont bank2">&#xe719;</i>
					<p>积分商城</p>
				</div>
				<div class="userselect2">
					<i class="iconfont bank2">&#xe6aa;</i>
					<p>我的</p>
				</div>
		</footer>

		<script type="text/javascript">
			$(function() {
				$('.userTop_right').click(function() {
					$('.userThumbnail').toggle(50);

				})
			})
		</script>
	</body>

</html>